<script lang="ts" setup>
import type { FileInfo } from '@/index.d';
import { useLoginUserStore } from '@/index';
import { type UploadInstance, type UploadRawFile, type UploadUserFile } from 'element-plus';

const props = defineProps({
  keyWord: {
    type: String,
    required: true
  },
  baseUrl: {
    type: String,
    required: true
  }
});

const upload = ref<UploadInstance>();
const { loginUser } = useLoginUserStore();
const fileList = ref<UploadUserFile[]>([]);
const headers = { Authorization: loginUser.token };
const extraData: FileInfo = {
  keyWord: props.keyWord
};

const handleBeforeUpload = (rawFile: UploadRawFile) => {
  // extraData.creatorId = loginUser.id;
  // extraData.type = rawFile.name;
  console.log(rawFile.name.endsWith('.xlsx') || rawFile.name.endsWith('.XLSX'));
};
const handlePictureCardPreview = (file: UploadUserFile) => {
  console.log(file);
};
</script>
<template>
  <el-upload
    v-model:file-list="fileList"
    ref="upload"
    action=""
    accept=".xlsx"
    :limit="1"
    :data="extraData"
    :headers="headers"
    :before-upload="handleBeforeUpload"
    :on-preview="handlePictureCardPreview"
    v-bind="$attrs"
  >
    <el-button type="primary">选择文件</el-button>
  </el-upload>
  <br />
</template>
<style lang="scss" scoped></style>
